import { Layout } from 'antd';
import Style from '@/assets/css/Index.module.scss'
import { AppstoreOutlined, DownOutlined, SmileOutlined } from '@ant-design/icons'
import { Dropdown, Space } from 'antd';
import NavMenu from '@/layout/navMenu';
import MyContent from '@/layout/content';
import Breadcrumb from '@/layout/breadCrumb';
import { Navigate, useNavigate } from "react-router-dom";
import { removeCookie } from '@/utils/cookie.js'
import { clearStorage } from '../utils/html5';
const { Header, Sider, Content } = Layout;
function Index() {
  const navigate = useNavigate();
  const exit = () => {
    removeCookie('_token');
    clearStorage();
    navigate('/login', { replace: true })
  }

  const items = [
    {
      key: '1',
      label: (
        <a target="_blank" rel="noopener noreferrer" onClick={() => { exit() }}>
          退出
        </a>
      ),
    }
  ];


  return (
    <Layout className={Style.index}>
      <Header
        style={{ padding: 0, background: 'Rgb(245, 245, 245)', borderBottom: '1px solid black' }}
      ><div className={Style.header}>
          <AppstoreOutlined />99999秦务员政务服务平台
          <div className={Style.right}>
            <Dropdown
              menu={{
                items,
              }}
            >
              <a onClick={(e) => e.preventDefault()}>
                <Space>
                  Hover me
                  <DownOutlined />
                </Space>
              </a>
            </Dropdown>
          </div>
        </div>
      </Header>
      <Layout>
        <Sider>
          <NavMenu></NavMenu>
        </Sider>
        <Content>
          <Breadcrumb></Breadcrumb>
          <MyContent></MyContent>
        </Content>
      </Layout>
    </Layout>
  );
}

export default Index;
